import {useEffect,useState} from 'react'
import {getShop} from '../api/purchase'
import { Pagination } from 'antd';
import { Space, Table, Tag } from 'antd';
import type { ColumnsType } from 'antd/es/table';
interface Iprops {
  groupInfo:any
}

const columns: ColumnsType<any> = [
  {
    title: '编号',
    dataIndex: 'id',
    key: 'id',     
  },
  {
    title: '名称',
    dataIndex: 'name',
    key: 'name',  
    
  },
  {
    title: '区域',
    dataIndex: 'address',
    key: 'address',     
  },
  {
    title: '业态',
    dataIndex: 'type',
    key: 'type',     
  },
   
  
]
function ShopList(props:Iprops) {
  const groupInfo = props.groupInfo
  const [pList,setPList] = useState([])
  const [pagination,setPagination] = useState({current:1,pageSize:2,total:3})

  useEffect(()=>{
    getShop({id:groupInfo.shop,size:pagination.pageSize,current:pagination.current})
    .then(res=>{
      setPList(res.data.data)
      const pa = res.data.pagnation;
      setPagination({
        current:pa.current,
        pageSize:pa.size,
        total:pa.total,
      })

    })
  },[pagination.current])
  return ( <div>
    <h2>店铺列表</h2>
    <Table columns={columns} dataSource={pList}   pagination={false} />
    <Pagination  
    onChange={current=>{setPagination({...pagination,current:current})}} 
    total={pagination.total}
    pageSize={pagination.pageSize}
    current={pagination.current}
    />
    <p>{JSON.stringify(pList)}</p>
    <hr/>
    <p>{JSON.stringify(groupInfo)}</p>
    </div> );
}

export default ShopList